<%@ page import="models.User" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<html>
<head lang="en">
    <meta http-equiv="content-type" content="text/html;charset=UTF-8">
    <title>早教机器人管理系统</title>
    <script charset="UTF-8" src="../resources/js/jquery.min.js"></script>
    <%--<script charset="UTF-8" src="../resources/js/controlMenu.js"></script>--%>
    <%--<script charset="UTF-8" src="../resources/js/initSetMenu.js"></script>--%>
    <script charset="UTF-8" src="../resources/js/showAndHide.js"></script>

    <link rel="stylesheet" href="../resources/css/public.css"/>
    <link rel="stylesheet" href="../resources/css/menuStyle.css"/>
    <link rel="stylesheet" href="../resources/css/func.css"/>
    <link rel="stylesheet" href="../resources/css/switch.css">

    <%
        //获取session中的user当前登录用户信息
        User user = (User) session.getAttribute("user");
        String name = user.getName();
    %>

</head>
<body>
<!--头部-->
<header class="publicHeader">
    <h1>早教机器人后台管理</h1>

    <div class="publicHeaderR">
        <p><span id="hours1"></span><span style="color: #fff21b"> &nbsp;<%=name%></span> , 欢迎你！</p>
        <a href="../views/init.jsp">退出</a>
    </div>
</header>
<!--时间-->
<div class="publicTime">
    <!--<span id="time">2015年1月1日 11:11  星期一</span>-->
    <span id="time">2015年1月1日 11:11 星期一</span>
    <!--<a href="#">温馨提示：为了能正常浏览，请使用高版本浏览器！（IE10+）</a>-->
</div>
<!--主体内容-->
<div class="publicMian">
    <div class="left">
        <h2 class="leftH2"><span class="span1"></span>功能列表 <span></span></h2>
        <nav>
            <form action="/pageSer">
                <ul class="list">
                    <li><a href="../views/func.jsp">功能管理</a></li>
                    <li><a href="../views/userAll.jsp">用户管理</a></li>
                    <li><a href="../views/voiceAll.jsp">语音管理</a></li>
                    <li><a href="../views/init.jsp">退出系统</a></li>
                </ul>
            </form>
        </nav>
    </div>
    <div class="right">
        <div class="location">
            <strong>你现在所在的位置是:</strong>
            <span>功能管理页面</span>
        </div>
        <div class="container">
            <!--form用来接收checkbox中的数据-->
            <form >
                <div id="ability" class="robotMsg div">
                    <!--智能工具-->
                    <div>
                        <p class="pTitnew ">智能工具</p>
                        <ul class="clearfix ">
                            <li>
                                <img id="img1" src="../resources/img/num_cal.png">
                                <p>数字计算</p>
                                <div class="wrap">
                                    <input type="checkbox" name="test" id="number_count"  />
                                    <label class="slider-v3" for="number_count"></label>
                                </div>
                            </li>
                            <li><img id="img2" src="../resources/img/chat.png">
                                <p>聊天对话</p>
                                <div class="wrap">
                                    <input type="checkbox" name="test" id="chat" />
                                    <label class="slider-v3" for="chat"></label>
                                </div>
                            </li>
                            <li><img id="img3" src="../resources/img/translation.png">
                                <p>中英互译</p>
                                <div class="wrap">
                                    <input type="checkbox" name="test" id="translation" />
                                    <label class="slider-v3" for="chat"></label>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <!--休闲娱乐-->
                    <div><p class="pTitnew">休闲娱乐</p>
                        <ul class="abilityList clearfix abilityListnew">
                            <li><img id="img4" src="../resources/img/laugh.png">
                                <p>笑话大全</p>
                                <div class="wrap">
                                    <input type="checkbox" name="test" id="joke" />
                                    <label class="slider-v3" for="joke"></label>
                                </div>
                            </li>
                            <li><img id="img5" src="../resources/img/story.png">
                                <p>故事大全</p>
                                <div class="wrap">
                                    <input type="checkbox" name="test" id="story" />
                                    <label class="slider-v3" for="story"></label>
                                </div>
                            </li>
                            <%--<li><img id="img5" src="../resources/img/phrase.png">--%>
                            <%--    <p>成语接龙</p>--%>
                            <%--    <div class="wrap">--%>
                            <%--        <input type="checkbox" name="test" id="idiom_game" />--%>
                            <%--        <label class="slider-v3" for="idiom_game"></label>--%>
                            <%--    </div>--%>
                            <%--</li>--%>
                            <li><img id="img6" src="../resources/img/brains.png">
                                <p>脑筋急转弯</p>
                                <div class="wrap">
                                    <input type="checkbox" name="test" id="brain_twists" />
                                    <label class="slider-v3" for="brain_twists"></label>
                                </div>
                            </li>
                            <li><img id="img7" src="../resources/img/afterword.png">
                                <p>歇后语</p>
                                <div class="wrap">
                                    <input type="checkbox" name="test" id="xiehouyu" />
                                    <label class="slider-v3" for="xiehouyu"></label>
                                </div>
                            </li>
                            <li><img id="img8" src="../resources/img/Tonguetwister.png">
                                <p>绕口令</p>
                                <div class="wrap">
                                    <input type="checkbox" name="test" id="tongue_twister" />
                                    <label class="slider-v3" for="tongue_twister"></label>
                                </div>
                            </li>
                            <li><img id="img9" src="../resources/img/Smooth.png">
                                <p>顺口溜</p>
                                <div class="wrap">
                                    <input type="checkbox" name="test" id="jingle" />
                                    <label class="slider-v3" for="jingle"></label>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <!--生活服务-->
                    <div><p class="pTitnew">生活服务</p>
                        <ul class="abilityList clearfix abilityListnew">
                            <%--<li><img id="img10" src="../resources/img/weather.png">--%>
                            <%--    <p>天气查询</p>--%>
                            <%--    <div class="wrap">--%>
                            <%--        <input type="checkbox" name="test" id="weather" />--%>
                            <%--        <label class="slider-v3" for="weather"></label>--%>
                            <%--    </div>--%>
                            <%--</li>--%>
                            <li><img id="img11" src="../resources/img/date.png">
                                <p>日期查询</p>
                                <div class="wrap">
                                    <input type="checkbox" name="test" id="date"  />
                                    <label class="slider-v3" for="date"></label>
                                </div>
                            <li><img id="img12" src="../resources/img/zipcode.png">
                                <p>城市邮编</p>
                                <div class="wrap">
                                    <input type="checkbox" name="test" id="postcode" />
                                    <label class="slider-v3" for="postcode"></label>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>

                <div id="alert1" class="detail-alert">
                    <div class="detail-wrap">
                        <div class="close"></div>
                        <div class="detail-top"><img src="/resources/img/num_cal.png"
                                                     class="detail-top-img">
                            <div class="detail-msg"><p class="p1">数字计算</p>
                                <p class="p2">此功能可进行加减乘除、乘方、开方、指数、对数、统计等多种运算</p>
                            </div>

                        </div>
                        <div class="detail-btm">
                            <div class="detail-btm-l">
                                <div class="line">
                                </div>
                                <ul>
                                    <li class="active">
                                        <a >简介</a>
                                        <span class="cirle"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="detail-btm-r">
                                <p class="p1" >
                                    <span class="span1" >能力介绍：
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span2" >此功能可进行乘方、开方、指数、对数、、统计等方面的运算。
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span3"><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span4" >使用示例：</span>
                                    <span class="span5" ><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span6" >“2乘2”“2开根号”“8的阶乘”</span>
                                </p>
                                <p class="p2">
                                    <span class="span7" >&nbsp;</span>
                                </p>
                                <p class="p2">
                            </div>
                        </div>
                    </div>
                </div>
                <div id="alert2" class="detail-alert">
                    <div class="detail-wrap">
                        <div class="close"></div>
                        <div class="detail-top"><img src="../resources/img/chat.png"
                                                     class="detail-top-img">
                            <div class="detail-msg"><p class="p1">聊天对话</p>
                                <p class="p2">此功能模拟人与人之间的对话闲谈，同时拥有简单的情感识别功能。</p>
                            </div>

                        </div>
                        <div class="detail-btm">
                            <div class="detail-btm-l">
                                <div class="line">
                                </div>
                                <ul>
                                    <li class="active">
                                        <a >简介</a>
                                        <span class="cirle"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="detail-btm-r">
                                <p class="p1" >
                                    <span class="span1" >能力介绍：
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span2" >此功能模拟人与人之间的对话进行生活话题的闲谈调侃，具有轻松和幽默的对话形式，同时拥有简单的情感识别功能，是闲暇时间进行互动的最佳形式，便捷易用。
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span3"><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span4" >使用示例：</span>
                                    <span class="span5" ><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span6" >“你好 ”&nbsp;“我生病了有点难受”</span>
                                </p>
                                <p class="p2">
                                    <span class="span7" >&nbsp;</span>
                                </p>
                                <p class="p2">
                            </div>
                        </div>
                    </div>
                </div>
                <div id="alert3" class="detail-alert">
                    <div class="detail-wrap">
                        <div class="close"></div>
                        <div class="detail-top"><img src="/resources/img/num_cal.png"
                                                     class="detail-top-img">
                            <div class="detail-msg"><p class="p1">中英互译</p>
                                <p class="p2">此功能提供优质的中文和英语的在线互译服务。</p>
                            </div>

                        </div>
                        <div class="detail-btm">
                            <div class="detail-btm-l">
                                <div class="line">
                                </div>
                                <ul>
                                    <li class="active">
                                        <a >简介</a>
                                        <span class="cirle"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="detail-btm-r">
                                <p class="p1" >
                                    <span class="span1" >能力介绍：
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span2" >中英互译是一项在线翻译服务，提供中文和英语的互译服务。可以通过使用中英互译功能为用户提供实时优质的翻译服务，提升产品体验。您只需要通过开启此功能，传入待翻译的内容，并指定要翻译的源语言和目标语言种类，就可以得到相应的翻译结果。
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span3"><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span4" >使用示例：</span>
                                    <span class="span5" ><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span6" >“苹果用英语怎么说”“苹果英语怎么说”“英语说苹果”</span>
                                </p>
                                <p class="p2">
                                    <span class="span7" >&nbsp;</span>
                                </p>
                                <p class="p2">
                            </div>
                        </div>
                    </div>
                </div>

                <div id="alert4" class="detail-alert">
                    <div class="detail-wrap">
                        <div class="close"></div>
                        <div class="detail-top"><img src="../resources/img/laugh.png"
                                                     class="detail-top-img">
                            <div class="detail-msg"><p class="p1">笑话大全</p>
                                <p class="p2">此功能可随机返回互联网的幽默、内涵的笑话与段子。</p>
                            </div>

                        </div>
                        <div class="detail-btm">
                            <div class="detail-btm-l">
                                <div class="line">
                                </div>
                                <ul>
                                    <li class="active">
                                        <a >简介</a>
                                        <span class="cirle"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="detail-btm-r">
                                <p class="p1" >
                                    <span class="span1" >能力介绍：
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span2" >笑话是篇幅短小，故事情节简单而巧妙，往往出人意料，给人突然之间笑神来了的奇妙感觉，取得笑的艺术效果。其趣味有高下之分。此功能可随机返回互联网的幽默、内涵的笑话与段子。
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span3"><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span4" >使用示例：</span>
                                    <span class="span5" ><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span6" >“给我讲个笑话” “换一个” “下一个”“不好笑”。</span>
                                </p>
                                <p class="p2">
                                    <span class="span7" >&nbsp;</span>
                                </p>
                                <p class="p2">
                            </div>
                        </div>
                    </div>
                </div>
                <div id="alert5" class="detail-alert">
                    <div class="detail-wrap">
                        <div class="close"></div>
                        <div class="detail-top"><img src="../resources/img/story.png"
                                                     class="detail-top-img">
                            <div class="detail-msg"><p class="p1">故事大全</p>
                                <p class="p2">可随机提供成语故事、寓言故事、童话故事等多种类的故事内容。</p>
                            </div>

                        </div>
                        <div class="detail-btm">
                            <div class="detail-btm-l">
                                <div class="line">
                                </div>
                                <ul>
                                    <li class="active">
                                        <a >简介</a>
                                        <span class="cirle"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="detail-btm-r">
                                <p class="p1" >
                                    <span class="span1" >能力介绍：
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span2" >可随机提供成语故事、寓言故事、童话故事等多种类的故事内容，种类丰富，资源海量。
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span3"><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span4" >使用示例：</span>
                                    <span class="span5" ><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span6" >“讲个故事”“讲个故事吧”“讲个白雪公主的故事吧”。</span>
                                </p>
                                <p class="p2">
                                    <span class="span7" >&nbsp;</span>
                                </p>
                                <p class="p2">
                            </div>
                        </div>
                    </div>
                </div>
                <%--<div id="alert5" class="detail-alert">--%>
                <%--    <div class="detail-wrap">--%>
                <%--        <div class="close"></div>--%>
                <%--        <div class="detail-top"><img src="../resources/img/phrase.png"--%>
                <%--                                     class="detail-top-img">--%>
                <%--            <div class="detail-msg"><p class="p1">成语接龙</p>--%>
                <%--                <p class="p2">此功能可实现在不同场景下的成语接龙游戏，用户与机器人一对一进行。</p>--%>
                <%--            </div>--%>

                <%--        </div>--%>
                <%--        <div class="detail-btm">--%>
                <%--            <div class="detail-btm-l">--%>
                <%--                <div class="line">--%>
                <%--                </div>--%>
                <%--                <ul>--%>
                <%--                    <li class="active">--%>
                <%--                        <a >简介</a>--%>
                <%--                        <span class="cirle"></span>--%>
                <%--                    </li>--%>
                <%--                </ul>--%>
                <%--            </div>--%>
                <%--            <div class="detail-btm-r">--%>
                <%--                <p class="p1" >--%>
                <%--                    <span class="span1" >能力介绍：--%>
                <%--                    </span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--                    <span class="span2" >成语接龙是采用成语字头与字尾相连不断延伸的方法进行接龙；用四个字成语的最后一个字与下一句成语的第一个相同的字，音同就可以，首尾相接不断延伸，形成长龙。一定是成语才可以继续，如果不是成语会自动退出接龙模式。--%>
                <%--                    </span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--                    <span class="span3"><br></span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--                    <span class="span4" >使用示例：</span>--%>
                <%--                    <span class="span5" ><br></span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--                    <span class="span6" >“成语接龙”<br>“玩成语接龙”<br>“来玩成语接龙吧”</span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--                    <span class="span7" >&nbsp;</span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--            </div>--%>
                <%--        </div>--%>
                <%--    </div>--%>
                <%--</div>--%>
                <div id="alert6" class="detail-alert">
                    <div class="detail-wrap">
                        <div class="close"></div>
                        <div class="detail-top"><img src="../resources/img/brains.png"
                                                     class="detail-top-img">
                            <div class="detail-msg"><p class="p1">脑筋急转弯</p>
                                <p class="p2">
                                    此功能随机提供脑筋急转弯及答案，内容丰富，趣味十足，简单易用。</p>
                            </div>

                        </div>
                        <div class="detail-btm">
                            <div class="detail-btm-l">
                                <div class="line">
                                </div>
                                <ul>
                                    <li class="active">
                                        <a >简介</a>
                                        <span class="cirle"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="detail-btm-r">
                                <p class="p1" >
                                    <span class="span1" >能力介绍：
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span2" >随机返回脑筋急转弯数据，脑筋急转弯最早起源于古代印度。就是指当思维遇到特殊的阻碍时，要很快的离开习惯的思路，从别的方面来思考问题。现在泛指一些不能用通常的思路来回答的智力问答题。
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span3"><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span4" >使用示例：</span>
                                    <span class="span5" ><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span6" >“脑筋急转弯”</span>
                                </p>
                                <p class="p2">
                                    <span class="span7" >&nbsp;</span>
                                </p>
                                <p class="p2">
                            </div>
                        </div>
                    </div>
                </div>
                <div id="alert7" class="detail-alert">
                    <div class="detail-wrap">
                        <div class="close"></div>
                        <div class="detail-top"><img src="../resources/img/afterword.png"
                                                     class="detail-top-img">
                            <div class="detail-msg"><p class="p1">歇后语</p>
                                <p class="p2">此功能提供海量歇后语，种类齐全，包含节气、季节、动物、谐音等。</p>
                            </div>

                        </div>
                        <div class="detail-btm">
                            <div class="detail-btm-l">
                                <div class="line">
                                </div>
                                <ul>
                                    <li class="active">
                                        <a >简介</a>
                                        <span class="cirle"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="detail-btm-r">
                                <p class="p1" >
                                    <span class="span1" >能力介绍：
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span2" >歇后语是中国劳动人民自古以来在生活实践中创造的一种特殊语言形式，是一种短小、风趣、形象的语句。它由前后两部分组成：前一部分起“引子”作用，像谜面，后一部分起“后衬”的作用，像谜底，十分自然贴切。此功能数据种类齐全，包含节气、季节、动物、昆虫、人物、谐音、等方面，应有尽有。歇后语是中国劳动人民自古以来在生活实践中创造的一种特殊语言形式，是一种短小、风趣、形象的语句。它由前后两部分组成：前一部分起“引子”作用，像谜面，后一部分起“后衬”的作用，像谜底，十分自然贴切。此功能数据种类齐全，包含节气、季节、动物、昆虫、人物、谐音、等方面，应有尽有。
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span3"><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span4" >使用示例：</span>
                                    <span class="span5" ><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span6" >“歇后语” “说个歇后语”</span>
                                </p>
                                <p class="p2">
                                    <span class="span7" >&nbsp;</span>
                                </p>
                                <p class="p2">
                            </div>
                        </div>
                    </div>
                </div>
                <div id="alert8" class="detail-alert">
                    <div class="detail-wrap">
                        <div class="close"></div>
                        <div class="detail-top"><img src="../resources/img/Tonguetwister.png"
                                                     class="detail-top-img">
                            <div class="detail-msg"><p class="p1">绕口令</p>
                                <p class="p2">此功能随机快速提供绕口令，内容丰富，使用便捷。</p>
                            </div>

                        </div>
                        <div class="detail-btm">
                            <div class="detail-btm-l">
                                <div class="line">
                                </div>
                                <ul>
                                    <li class="active">
                                        <a >简介</a>
                                        <span class="cirle"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="detail-btm-r">
                                <p class="p1" >
                                    <span class="span1" >能力介绍：
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span2" >随机快速返回绕口令数据，绕口令又称急口令、吃口令、拗口令等。是一种汉族传统的语言游戏，由于它是将若干双声、叠词词汇或发音相同、相近的语、词有意集中在一起，组成简单、有趣的语韵，要求快速念出，所以读起来使人感到节奏感强，妙趣横生。
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span3"><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span4" >使用示例：</span>
                                    <span class="span5" ><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span6" >“绕口令”“说个绕口令”</span>
                                </p>
                                <p class="p2">
                                    <span class="span7" >&nbsp;</span>
                                </p>
                                <p class="p2">
                            </div>
                        </div>
                    </div>
                </div>
                <div id="alert9" class="detail-alert">
                    <div class="detail-wrap">
                        <div class="close"></div>
                        <div class="detail-top"><img src="../resources/img/Smooth.png"
                                                     class="detail-top-img">
                            <div class="detail-msg"><p class="p1">顺口溜</p>
                                <p class="p2">此功能提供随机的顺口溜，是民间流行的一种口头韵文。</p>
                            </div>

                        </div>
                        <div class="detail-btm">
                            <div class="detail-btm-l">
                                <div class="line">
                                </div>
                                <ul>
                                    <li class="active">
                                        <a >简介</a>
                                        <span class="cirle"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="detail-btm-r">
                                <p class="p1" >
                                    <span class="span1" >能力介绍：
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span2" >顺口溜，是民间流行的一种口头韵文，句子长短不齐，纯用口语，念起来很顺口。我们把当代流行的这种语言现象称作“新民谣”，也就是顺口溜。无需开发功能，便捷易用。
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span3"><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span4" >使用示例：</span>
                                    <span class="span5" ><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span6" >“给我讲个顺口溜” “顺口溜”</span>
                                </p>
                                <p class="p2">
                                    <span class="span7" >&nbsp;</span>
                                </p>
                                <p class="p2">
                            </div>
                        </div>
                    </div>
                </div>
                <%--<div id="alert10" class="detail-alert">--%>
                <%--    <div class="detail-wrap">--%>
                <%--        <div class="close"></div>--%>
                <%--        <div class="detail-top"><img src="../resources/img/weather.png"--%>
                <%--                                     class="detail-top-img">--%>
                <%--            <div class="detail-msg"><p class="p1">天气查询</p>--%>
                <%--                <p class="p2"> 此功能可查询全国2567个城市、2056个热门旅游景点和全球天气情况。</p>--%>
                <%--            </div>--%>

                <%--        </div>--%>
                <%--        <div class="detail-btm">--%>
                <%--            <div class="detail-btm-l">--%>
                <%--                <div class="line">--%>
                <%--                </div>--%>
                <%--                <ul>--%>
                <%--                    <li class="active">--%>
                <%--                        <a >简介</a>--%>
                <%--                        <span class="cirle"></span>--%>
                <%--                    </li>--%>
                <%--                </ul>--%>
                <%--            </div>--%>
                <%--            <div class="detail-btm-r">--%>
                <%--                <p class="p1" >--%>
                <%--                    <span class="span1" >能力介绍：--%>
                <%--                    </span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--                    <span class="span2" >可查询全国2567个城市、全国2056个热门旅游景点和全球天气情况，包括3天天气预报、全国灾害预警、实况天气、每小时天气、PM2.5空气质量、生活指数等丰富数据。--%>
                <%--                    </span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--                    <span class="span3"><br></span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--                    <span class="span4" >使用示例：</span>--%>
                <%--                    <span class="span5" ><br></span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--                    <span class="span6" >“北京天气”“北京明天天气”“北京后天天气”</span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--                    <span class="span7" >&nbsp;</span>--%>
                <%--                </p>--%>
                <%--                <p class="p2">--%>
                <%--            </div>--%>
                <%--        </div>--%>
                <%--    </div>--%>
                <%--</div>--%>
                <div id="alert11" class="detail-alert">
                    <div class="detail-wrap">
                        <div class="close"></div>
                        <div class="detail-top"><img src="../resources/img/date.png"
                                                     class="detail-top-img">
                            <div class="detail-msg"><p class="p1">日期查询</p>
                                <p class="p2">此功能支持对任一日期、星期、以及节假日时间的查询。</p>
                            </div>

                        </div>
                        <div class="detail-btm">
                            <div class="detail-btm-l">
                                <div class="line">
                                </div>
                                <ul>
                                    <li class="active">
                                        <a >简介</a>
                                        <span class="cirle"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="detail-btm-r">
                                <p class="p1" >
                                    <span class="span1" >能力介绍：
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span2" >支持对星期、日期、以及节假日时间的查询。
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span3"><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span4" >使用示例：</span>
                                    <span class="span5" ><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span6" >“今天日期”“明年母亲节日期”“1999年重阳节日期”</span>
                                </p>
                                <p class="p2">
                                    <span class="span7" >&nbsp;</span>
                                </p>
                                <p class="p2">
                            </div>
                        </div>
                    </div>
                </div>
                <div id="alert12" class="detail-alert">
                    <div class="detail-wrap">
                        <div class="close"></div>
                        <div class="detail-top"><img src="../resources/img/zipcode.png"
                                                     class="detail-top-img">
                            <div class="detail-msg"><p class="p1">城市邮编</p>
                                <p class="p2">此功能提供全国多个省、市、县的邮编号码查询，数据权威准确。</p>
                            </div>

                        </div>
                        <div class="detail-btm">
                            <div class="detail-btm-l">
                                <div class="line">
                                </div>
                                <ul>
                                    <li class="active">
                                        <a >简介</a>
                                        <span class="cirle"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="detail-btm-r">
                                <p class="p1" >
                                    <span class="span1" >能力介绍：
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span2" >此功能提供全国多个省、市、县的邮编号码查询，数据权威准确，精确到区、县、街道。支持按模糊地址、指定区域地址查询邮编。
                                    </span>
                                </p>
                                <p class="p2">
                                    <span class="span3"><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span4" >使用示例：</span>
                                    <span class="span5" ><br></span>
                                </p>
                                <p class="p2">
                                    <span class="span6" >“北京邮编”</span>
                                </p>
                                <p class="p2">
                                    <span class="span7" >&nbsp;</span>
                                </p>
                                <p class="p2">
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
<footer class="footer">
</footer>
<div style="text-align:center;">
</div>
<script charset="UTF-8" src="../resources/js/time2.js"></script>

</body>
</html>